import Dom from "./Dom";
import RanDom from "./RanDom";
export default class CreateNode {
    static Cube(wh: number = 100): HTMLElement {
        const Cube: HTMLElement = new Dom('div', undefined, { width: wh, height: wh }) as HTMLElement;
        Cube.className = 'Cube';
        Cube.style.position = 'absolute';
        Cube.style.zIndex = '4';
        const Span: HTMLElement = new Dom('div', undefined, { width: wh, height: wh }) as HTMLElement;
        const bgColor = RanDom.randomColor();
        Span.style.display = 'felx';
        Span.style.justifyContent = 'center';
        Span.style.perspective = `1500px`;
        Span.style.perspectiveOrigin = `center 250%`;
        Span.style.transformStyle = `preserve-3d`;
        for (let i = 0; i < 4; i++) {
            const node = new Dom('div', i.toString()) as HTMLElement;
            node.style.width = `${wh * 0.7}px`;
            node.style.height = `${wh * 0.7}px`;
            node.style.position = 'absolute';
            // node.style.filter = 'contrast(100%)';
            node.style.background = bgColor;
            node.style.transform = `rotateY(${i * 90}deg) translateZ(${wh * 0.7 / 2}px)`;
            Span.appendChild(node);
        }
        Cube.appendChild(Span);
        return Cube;
    }
    static Img(wh: number = 20): HTMLElement {
        const node = new Dom('div', undefined, { width: wh, height: 'auto' }) as HTMLElement;
        node.className = 'Img';
        // node.style.zIndex = '2';
        // node.style.transform = RanDom.randomtran();
        node.style.padding = '5px';
        node.style.display = 'flex';
        node.style.flexDirection = 'column';
        node.style.backgroundColor = '#fff';
        node.style.position = 'absolute';
        node.style.boxShadow = '1px 1px 1px #333';
        const img = new Dom('div', undefined, { width: wh, height: wh }) as HTMLImageElement;
        img.style.backgroundSize = 'cover';
        img.style.backgroundImage = `url("../static/imgs/${Math.floor(Math.random() * 14)}.jpg")`;
        const txt = new Dom('span', undefined, { width: wh, height: 'auto' }) as HTMLImageElement;
        txt.style.margin = '5px 0 10px 0';
        txt.style.textIndent = '14px';
        txt.style.fontSize = '90%'
        txt.style.fontFamily = '仿宋';
        node.appendChild(img);
        node.appendChild(txt);
        return node;
    }
    static Audio() {
        const audio = new Audio();
        const ctx = new AudioContext();
        const analyser = ctx.createAnalyser();
        analyser.fftSize = 512;
        const source = ctx.createMediaElementSource(audio);
        source.connect(analyser);
        analyser.connect(ctx.destination);
    }
}